import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:jetour_line/map/base_map_widget.dart';
import 'package:jetour_line/my_colors.dart';
import 'package:jetour_line/pages/line/lineDetail/line_detali_image_page.dart';
import 'package:jetour_line/utils/extension_int.dart';
import 'package:jetour_line/utils/page_push_utils.dart';

import '../../../base_widget/banner_widget.dart';
import '../../../base_widget/base_image.dart';
import '../../../base_widget/sliver_list_widget.dart';
import '../../../models/trajectory_detail_model.dart';
import '../../map_detail_page.dart';

class TrajectoryDetailHeadWidget extends StatefulWidget {
  final  TrajectoryDetailModel detailModel;

  const TrajectoryDetailHeadWidget({Key? key, required this.detailModel})
      : super(key: key);

  @override
  State<TrajectoryDetailHeadWidget> createState() => _TrajectoryDetailHeadWidgetState();
}

class _TrajectoryDetailHeadWidgetState extends State<TrajectoryDetailHeadWidget> {

  @override
  Widget build(BuildContext context) {
    return SliverListWidget.getSliverList(1, (context, index) {
      return Padding(
        padding: EdgeInsets.only(bottom: 40.px),
        child: Stack(
          children: [
            titleWidget()
            // titleWidget(),
          ],
        ),
      );
    });
  }

  Widget titleWidget() {
    String caption = widget.detailModel.caption;
    bool fish = widget.detailModel.finished == 1;
    String msg = '总里程${widget.detailModel.distance}km · 平均时速${widget.detailModel.speed}km/h · 海拔${widget.detailModel.asl}m';
    if(widget.detailModel.distance>1000){
      msg = '总里程${(widget.detailModel.distance/1000).
      toStringAsFixed(2)}km';
    }else if(widget.detailModel.distance<1){
      msg = '总里程1m';
    }else{
      msg = '总里程${widget.detailModel.distance}m';
    }
    msg = '$msg · 平均时速${widget.detailModel.speed}km/h · 海拔${widget.detailModel.asl}m';
    return Container(
      padding: EdgeInsets.only(
          top: 40.px, left: 24.px, right: 24.px, bottom: 24.px),
      color: MyColors.white,
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            caption,
            style: TextStyle(
                fontSize: 36.px,
                color: MyColors.color1A1A1A,
                fontWeight: FontWeight.w500),
          ),
          SizedBox(height: 40.px,),
          ClipRRect(borderRadius: BorderRadius.all(Radius.circular(4.px)),child: Container(
            color: MyColors.color344,
            child: Padding(padding: EdgeInsets.only(left: 10.px,right: 10.px),child: Text(fish?"已完成的轨迹":"未完成的轨迹",style: TextStyle(fontSize: 22.px,color: MyColors.colorEE7219),),)
          ),),
          SizedBox(height: 30.px,),
          Text(
            msg,
            style: TextStyle(
                fontSize: 28.px,
                color: MyColors.color666666,
                fontWeight: FontWeight.w500),
          ),
          SizedBox(height: 30.px,),
          Container(width: double.infinity,height: 1,color: MyColors.colorE1E1E1,),
          SizedBox(height: 30.px,),
          // Expanded(child: Container(height: 1.px,color: MyColors.colorF1F1F1,)),
          Text(
            "自驾轨迹",
            style: TextStyle(
                fontSize: 32.px,
                color: MyColors.color1A1A1A,
                fontWeight: FontWeight.w500),
          ),
          SizedBox(
            height: 32.px,
          ),
          Container(
            width: double.infinity,
            height: 250.px,
            child: mapWidget(),
          ),
        ],
      ),
    );
  }
  List nodes = [];
  Widget mapWidget(){
    int index = 1;
    for(int j = 0;j<widget.detailModel.markers.length;j++){
      Marker node = widget.detailModel.markers[j];
      Map<String,dynamic> map = {};
      map['index'] = index++;
      map['childIndex'] = j;
      map['caption'] = node.caption;
      map['lat'] = node.lat;
      map['lng'] = node.lng;
      map['type'] = 'commonDetail';
      nodes.add(map);
    }

    // for(int j = 0;j<widget.detailModel.points.length;j++){
    //   List<Point> point = widget.detailModel.points[j];
    //   for(int k = 0;k<point.length;k++){
    //     Point node = point[k];
    //     Map<String,dynamic> map = {};
    //     map['index'] = index++;
    //     map['lat'] = node.lat;
    //     map['lng'] = node.lng;
    //     map['type'] = 'commonDetail';
    //     nodes.add(map);
    //   }
    //
    // }

    return Stack(alignment: Alignment.center, children: [
      BaseMapWidget(creationParams: nodes,),
      GestureDetector(onTap: (){
        PagePushUtils.push(context, MapDetailScreen(markers: nodes));
      },child: ClipRRect(borderRadius: BorderRadius.all(Radius.circular(16.px)), child:  Container(
        width: 188.px,
        height: 114.px,
        color: MyColors.white,
        child: Column(mainAxisAlignment: MainAxisAlignment.center, children: [
          BaseImage(image: 'icon_lsmap',width: 40.px,height: 40.px,),
          Text("查看地图",style: TextStyle(fontSize: 24.px,color: MyColors.appColor,))
        ],),
      ),))
    ],);
  }
}
